<template>
  <el-dialog
    :title="'查看报文'"
    width="100%"
    :fullscreen="true"
    top="0"
    :close-on-click-modal="false"
    :visible.sync="visible">
    <el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="120px">
      <el-row>
        
        <el-col :span="12">
          <el-form-item label="时间" prop="recordtime"  class="label_font">
            <el-input  v-model="dataForm.recordtime" disabled></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="业务流水号" prop="busino"  class="label_font">
            <el-input v-model="dataForm.busino" disabled></el-input>
          </el-form-item>
        </el-col>
      </el-row>

    <el-row>
      <el-col :span="12">
        <el-form-item label="业务件号" prop="serviceno"  class="label_font">
          <el-input v-model="dataForm.serviceno" disabled></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label="业务标识码" prop="servicecode"  class="label_font">
            <el-input v-model="dataForm.servicecode" disabled></el-input>
          </el-form-item>
      </el-col>
    </el-row>


    <el-row>
      <el-col :span="12">
        <el-form-item label="请求报文" prop="reqmessage"  class="label_font">
          <el-input type="textarea" v-model="dataForm.reqmessage"  rows="20" placeholder="请求报文" disabled></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="12">

        <el-form-item label="响应报文" prop="resmessage"  class="label_font">
          <el-input type="textarea" v-model="dataForm.resmessage"   rows="20"  placeholder="响应报文" disabled></el-input>
        </el-form-item>

      </el-col>
    </el-row>




   
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="visible = false">关闭</el-button>
    </span>
  </el-dialog>
</template>

<script>
  export default {
    data () {
      return {
        visible: false,
        dataForm: {
          seqno: 0,
          recordtime: '',
          busino: '',
          serviceno: '',
          servicecode: '',
          reqmessage: '',
          resmessage: ''
        },
        dataRule: {

        }
      }
    },
    methods: {
      init (id) {
        this.dataForm.seqno = id 
        this.visible = true
        this.$nextTick(() => {
          this.$refs['dataForm'].resetFields()
          if (this.dataForm.seqno) {
            this.$http({
              url: this.$http.adornUrl(`/bdc/bdcmessage/info/${this.dataForm.seqno}`),
              method: 'get',
              params: this.$http.adornParams()
            }).then(({data}) => {
              if (data && data.code === 0) {
                this.dataForm.recordtime = data.bdcMessage.recordtime
                this.dataForm.busino = data.bdcMessage.busino
                this.dataForm.serviceno = data.bdcMessage.serviceno
                this.dataForm.servicecode = data.bdcMessage.servicecode
                this.dataForm.reqmessage = data.bdcMessage.reqmessage
                this.dataForm.resmessage = data.bdcMessage.resmessage
              }
            })
          }
        })
      }

    }
  }
</script>
<style>
.el-input.is-disabled .el-input__inner {
    background-color: #f5f7fa;
    border-color: #e4e7ed;
    color: #313b50;
    cursor: not-allowed;
}

.el-textarea.is-disabled .el-textarea__inner {
    background-color: #f5f7fa;
    border-color: #e4e7ed;
    color: #313b50;
    cursor: not-allowed;
}
<style>
.el-textarea.is-disabled .el-textarea__inner {
    background-color: #f5f7fa;
    border-color: #e4e7ed;
    color: #313b50;
    cursor: not-allowed;
}
</style>